﻿<UserControl x:Class="Test.Silverlight.DataGrid.Preview"
    xmlns="http://schemas.microsoft.com/client/2007" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    xmlns:local="clr-namespace:Test.Silverlight.DataGrid;assembly=Test.Silverlight.DataGrid"
    xmlns:grid="clr-namespace:DevExpress.AgDataGrid;assembly=DevExpress.AgDataGrid.v8.2"
    xmlns:vsm="clr-namespace:System.Windows;assembly=System.Windows">
    
    <UserControl.Resources>
        <DataTemplate x:Key="GridPreviewTemplate">
			<Grid x:Name="RootElement">
				<Grid.Resources>
					<Style x:Name="NormalText" TargetType="TextBlock">
						<Setter Property="TextWrapping" Value="Wrap" />
					</Style>
				</Grid.Resources>
				<Border BorderBrush="Silver" BorderThickness="0,1,0,0" Height="204" VerticalAlignment="Top">
					<Border.Background>
						<LinearGradientBrush StartPoint="0,0" EndPoint="0,1" SpreadMethod="Pad">
							<GradientStop Color="#f1f1f1" Offset="0"/>
							<GradientStop Color="#eaeaea" Offset="1"/>
						</LinearGradientBrush>
					</Border.Background>
				</Border>
				<Grid Height="204">
					<Grid.ColumnDefinitions>
						<ColumnDefinition Width="Auto"/>
                        <ColumnDefinition Width="30"/>
                        <ColumnDefinition Width="Auto"/>
					</Grid.ColumnDefinitions>
                    <Canvas Grid.Column="0" Width="150" Height="106" VerticalAlignment="Top">
                        <Grid x:Name="IconContainer" Width="150" Height="106" Canvas.Left="16" Canvas.Top="16">
                            <Border Margin="5,5,0,0" Background="Black" Opacity="0.15" CornerRadius="5" />
                            <Border Background="#FF6E6E6E" CornerRadius="4,4,4,4" Padding="4" Margin="0,0,5,5">
                                <Border Background="White" CornerRadius="2,2,2,2" Padding="3">
                                    <Border.Resources>
                                        <grid:AgDataGridImageColumnContentConverter x:Key="ImageContentConverter"/>
                                    </Border.Resources>
                                    <Image x:Name="Icon" Cursor="Hand" Source="{Binding Picture, Converter={StaticResource ImageContentConverter}}" Stretch="Uniform"
                                           MouseLeftButtonDown="Icon_MouseLeftButtonDown"/>
                                </Border>
                            </Border>
                        </Grid>
                    </Canvas>
                    <StackPanel Grid.Column="2" Margin="0,16,16,12" Orientation="Vertical">
						<ScrollViewer x:Name="scrollViewer" Margin="0,0,0,6" MaxHeight="140" Background="White">
							<TextBlock x:Name="Description" Width="518" Style="{StaticResource NormalText}" 
									   Text="{Binding Description}" Padding="4,2,2,2"/>
						</ScrollViewer>
						<StackPanel Orientation="Horizontal">
							<TextBlock Style="{StaticResource NormalText}" Text="Price: $" VerticalAlignment="Center"/>
							<TextBlock Style="{StaticResource NormalText}" Text="{Binding Price}" Margin="0,0,12.5,0" VerticalAlignment="Center"/>
							<Button Content="Order Now!" Click="Button_Click" x:Name="orderNowButton"/>
						</StackPanel>
					</StackPanel>
				</Grid>
			</Grid>
		</DataTemplate>
		<DataTemplate x:Name="OptionsPanelTemplate">
			<StackPanel Orientation="Horizontal" Loaded="OptionsPanel_Loaded">
				<TextBlock Text="Preview Row:" Margin="0,0,6,0" VerticalAlignment="Center"/>
			    <RadioButton x:Name="rbCollapsed" GroupName="1" Checked="rb_Checked" Margin="0,0,10,0" Content="Collapsed"/>
			    <RadioButton x:Name="rbForAllRows" GroupName="1" Checked="rb_Checked" Margin="0,0,10,0" Content="For all rows"/>
			    <RadioButton x:Name="rbForFocusedRow" GroupName="1" Checked="rb_Checked" Margin="0,0,10,0" Content="For focused row"/>
            </StackPanel>
		</DataTemplate>
	</UserControl.Resources>
    
	<Grid x:Name="LayoutRoot">
		<grid:AgDataGrid x:Name="grid" ColumnsAutoWidth="True" Loaded="grid_Loaded"
                         PreviewTemplate="{StaticResource GridPreviewTemplate}" AllowEditing="True" PreviewVisibility="ForAllRows" PreviewStatus="grid_PreviewStatus">
            <grid:AgDataGrid.Resources>
                <local:CurrencyToStringConverter x:Name="CurrencyToStringConverter"/>
            </grid:AgDataGrid.Resources>
			<grid:AgDataGrid.Columns>
				<grid:AgDataGridTextColumn FieldName="Trademark" Width="200"/>
				<grid:AgDataGridTextColumn FieldName="Model" Width="250"/>
				<grid:AgDataGridTextColumn FieldName="HP" Width="50"/>
				<grid:AgDataGridTextColumn FieldName="Liter" Width="50" />
				<grid:AgDataGridColumn FieldName="TransmissSpeedCount" Width="50" HeaderContent="Transmiss" PrepareCellDisplayElement="TransmissSpeedCountColumn_PrepareCellDisplayElement">
					<grid:AgDataGridColumn.CellDisplayTemplate>
						<DataTemplate>
							<TextBlock x:Name="SpeedText"/>
                        </DataTemplate>
					</grid:AgDataGridColumn.CellDisplayTemplate>
				</grid:AgDataGridColumn>
				<grid:AgDataGridTextColumn FieldName="Category" Width="100"/>
                <grid:AgDataGridColumn FieldName="Price" Width="100" AllowEditing="False">
                    <grid:AgDataGridColumn.CellDisplayTemplate>
                        <DataTemplate>
                            <TextBlock Text="{Binding CellValue, Converter={StaticResource CurrencyToStringConverter}}"/>
                        </DataTemplate>
                    </grid:AgDataGridColumn.CellDisplayTemplate>
                </grid:AgDataGridColumn>
            </grid:AgDataGrid.Columns>
		</grid:AgDataGrid>
		<Canvas x:Name="GlobalImageContainerCanvas">
			<Canvas.Resources>
				<Storyboard x:Name="Large" >
					<DoubleAnimation Storyboard.TargetName="GlobalImageContainer" Storyboard.TargetProperty="Width" Duration="00:00:00.2" To="715" />
					<DoubleAnimation Storyboard.TargetName="GlobalImageContainer" Storyboard.TargetProperty="Height" Duration="00:00:00.2" To="484" />
					<DoubleAnimation Storyboard.TargetName="GlobalImageContainer" Storyboard.TargetProperty="(Canvas.Left)"  
									 Duration="00:00:00.2" To="-282" />
					<DoubleAnimation Storyboard.TargetName="GlobalImageContainer" Storyboard.TargetProperty="(Canvas.Top)"
									 Duration="00:00:00.2" To="-189" />
					<DoubleAnimation Storyboard.TargetName="GlobalImageContainer" Storyboard.TargetProperty="Opacity" BeginTime="00:00:00"
									 Duration="00:00:00" To="1" />
				</Storyboard>
				<Storyboard x:Name="Small">
					<DoubleAnimation Storyboard.TargetName="GlobalImageContainer" Storyboard.TargetProperty="Width" Duration="00:00:00.2" To="150" />
					<DoubleAnimation Storyboard.TargetName="GlobalImageContainer" Storyboard.TargetProperty="Height" Duration="00:00:00.2" To="106" />
					<DoubleAnimation Storyboard.TargetName="GlobalImageContainer" Storyboard.TargetProperty="(Canvas.Left)" 
									 Duration="00:00:00.2" To="0" />
					<DoubleAnimation Storyboard.TargetName="GlobalImageContainer" Storyboard.TargetProperty="(Canvas.Top)" 
									 Duration="00:00:00.2" To="0" />
					<DoubleAnimation Storyboard.TargetName="GlobalImageContainer" Storyboard.TargetProperty="Opacity" BeginTime="00:00:00.2"
									 Duration="00:00:00" To="0" />
				</Storyboard>
			</Canvas.Resources>
			<Grid x:Name="GlobalImageContainer" Width="150" Height="106" MouseLeave="Icon_MouseLeave" IsHitTestVisible="False" Opacity="0" RenderTransformOrigin=".5,.5">
				<Border Margin="5,5,0,0" Background="Black" Opacity="0.15" CornerRadius="5" />
				<Border Background="#FF6E6E6E" CornerRadius="4,4,4,4" Padding="4" Margin="0,0,5,5" MouseLeave="Icon_MouseLeave" MouseLeftButtonDown="Border_MouseLeftButtonDown">
					<Border Background="White" CornerRadius="2,2,2,2" Padding="3">
						<Image x:Name="GlobalImage" Stretch="Uniform"/>
					</Border>
				</Border>
			</Grid>
		</Canvas>
	</Grid>
    
</UserControl>